<!--
 * @Author: 熔岩巨兽 2141826215@qq.com
 * @Date: 2024-08-31 13:53:28
 * @LastEditTime: 2024-08-31 14:11:34
 * @LastEditors: 熔岩巨兽 2141826215@qq.com
 * @FilePath: \vue-vite-project\src\views\CommunicationMode\eventBus\event1.vue
 * Copyright (c) 2024 by 熔岩巨兽 2141826215@qq.com, All Rights Reserved. 
-->
<template>
  <div class="count_warpper1">
    <h1>我是组件1</h1>
    <h2>组件2传递的信息:{{ msg }}</h2>
  </div>
</template>

<script lang="ts" setup name="event1">
import { ref } from "vue";
let msg = ref<string>("等待接收");
import $bus from "@/eventBus";
//引入挂载的钩子函数
import { onMounted } from "vue";

onMounted(() => {
  $bus.on("eventBus", (data) => {
    msg.value = data as string;
  });
});
</script>

<style scoped>
.count_warpper1 {
  width: 300px;
  height: 300px;
  background-color: skyblue;
}
</style>
